<template>
	<view class="content">
		<navigator :url="'../userhome/userhome?uid=' + userlist.uid + '&username=' + userlist.user_name" class="userlist" v-for="userlist in userlists" :key="userlist.uid">
			<image v-if="userlist.avatar_file == null" class="touxiang" src="https://www.yedushu.cn/usersface/default/avatar-min.png"></image>
			<image v-else class="touxiang" :src="'https://www.yedushu.cn/' + userlist.avatar_file"></image>
			<view class="uinfo">
				<text class="username">{{userlist.user_name}}</text>
				<text v-if="userlist.attrib == null" class="qianming">此人没有添加个性签名</text>
				<text v-else class="qianming">{{userlist.attrib.signature}}</text>
			</view>
		</navigator>
		<view v-if="isLoading" class="isload">加载更多...</view>
		<view v-else class="isend">~~ 我是有底线的 ~~</view>
	</view>
</template>

<script>
	export default {		
		data() {
			return {
				userlists: [],
				current_page: 1,
				isLoading: false
			}
		},
		// 发送给朋友
		onShareAppMessage(res) {
			//if (res.from === 'button') {
			// // 来自页面内分享按钮
			// 	console.log(res.target)
			//}
			return {
				title: '来夜读书看看书友都在读哪些书？！（夜读书）',
				path: '/pages/books/userlist'				
			}
		},
		// 分享到朋友圈
		onShareTimeline(res) {
			return {
				title: '夜读书-我们的精神角落！',
				imageUrl: "https://www.yedushu.cn/images/yedushu_sharp_logo.png"
			}
		},
		onLoad() {
			this.isLoading = true;
			this.getBookList();
		},
		onPullDownRefresh() {
			// 下拉刷新
			// 清空数据
			this.userlists = [];
			// 获取第一页数据
			this.current_page = 1;
			// 开始获取数据
			this.getBookList();
		},
		onReachBottom() {
			// 上拉刷新
			// 获得当前页面
			this.current_page = this.current_page + 1;
			this.getBookList();
		},
		methods: {
			// getImgUrl(image){
			//    return "https://www.yedushu.cn/"+image;
			// },			
			getBookList() {
				var url = 'https://www.yedushu.cn/api/userlist?page=' + this.current_page;
				uni.request({
				    url: url, //书籍列表
				    success: (res) => {
				        // console.log(res.data);
						if(res.data.last_page > this.current_page)
						{
							this.isLoading = true;
						}
						// 当前以后数据连接新获取的数据
						this.userlists = this.userlists.concat(res.data.data);
						// 停止页面刷新动画
						uni.stopPullDownRefresh();
				    }
				});				
			}
		}
	}
</script>

<style>
	.content {
		display: flex;
		flex-direction: column;
	}
	.userlist {
		display: flex;
		flex-direction: row;
		padding: 15px 10px;
		border-bottom: 1px dashed #E8E8E8;
	}
	.uinfo {
		display: flex;
		flex-direction: column;
		padding-left: 10px;
		justify-content: center;
	}
	.touxiang {
		width: 60px;
		height: 60px;
		border-radius: 50%;
	}
	.username {
		font-size: 16px;
		padding-bottom: 5px;
	}
	.qianming {
		font-size: 14px;
		overflow: hidden;/*超出部分隐藏*/
		white-space: nowrap;/*不换行*/
		text-overflow:ellipsis;/*超出部分文字以...显示*/
	}
	.isload {
		font-size: 14px;
		padding: 20px 0px;
		text-align: center;
	}
	.isend {
		font-size: 14px;
		padding: 10px 10px;
		text-align: center;		
	}
</style>
